<template>
	<view class="content">
		<view class="center">
			<view class="flexcenter" style="margin-top: 200rpx;" v-if="!list.data.length">
				<view class="placeimage"></view>
			</view>
			<view class="" v-if="list.data.length" style="padding-bottom: 150rpx;">
				<view class="nav_b margin_top" v-for="(item,index) in list.data" :key="item.id" @click="jumpdetail(item)">
					<view class="nav_xian flexstart">
						<view>
							<image :src="item.image_text" mode="" class="car_img"></image>
						</view>
						<view>
							<view class="right_henan">{{item.title}}</view>
							<view class="cm">{{item.goodsprice.difference}}</view>
							<view class="cm">零售价：￥{{item.price}}</view>
						</view>
					</view>
					<view class="posilable" style="color: rgba(243, 173, 61, 1); background-color: rgba(243, 173, 61, .2);" v-if="item.sh_status==1">审核中</view>
					<view class="posilable" style="color: rgba(0, 117, 255, 1); background-color: rgba(0, 117, 255, .2);" v-if="item.sh_status==2">已审核</view>
					<view class="posilable" style="color: rgba(255, 0, 0, 1); background-color: rgba(255, 0, 0, .2);" v-if="item.sh_status==3">审核失败</view>
					<!-- 地址 -->
					<view class="liu flexbetween">
						<view class="flexleft" @click.stop="edit('/pages/mypage/tianjiashangpin?id=',item.id)">
							<view class="bianji"></view>
							<view class="liulan text">编辑 </view>
						</view>
						<view class="flexleft" @click.stop="xiajia(item)">
							<view class="xiajia"></view>
							<view class="liulan text">{{item.status=="hidden"?"上架":"下架"}} </view>
						</view>
						<view class="flexleft" @click.stop="del(item,index)">
							<view class="del"></view>
							<view class="liulan text">删除 </view>
						</view>
					</view>
				</view>
				<view class="footertextdaodi">老板！到底没数据了！</view>
			</view>

		</view>
		<view class="gudingdb" @click="tianjia">
			<view class="bigbtn">添加商品</view>
		</view>
	</view>
</template>
<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				page: 1,
				limit: 12,
				list: {
					data: []
				},
			}
		},
		onShow() {
			this.init()
		},
		methods: {
			jumpdetail(item) {
				uni.navigateTo({
					url: "/pages/shopping/shangpinxq?id=" + item.id
				})
			},
			// 编辑
			edit(url, id) {
				uni.navigateTo({
					url: url + id
				})
			},
			// 下架
			xiajia(item) {
				let tishitext = item.status == "normal" ? "确认下架当前内容吗?" : "确认上架当前内容吗?"
				let satatus = item.status == "normal" ? "hidden" : "normal"
				let data = {
					id: item.id,
					status: satatus
				}
				let url = "/api/goods/setGoodsStatus"
				httpRequest.modal('提示', tishitext, true, (res) => {
					if (res) {
						httpRequest.request(url, 'GET', data, false, false, true).then(res => {
							httpRequest.toast(res.msg)
							if (res.code == 1) {
								item.status = satatus
							}
						}).catch(err => {
							httpRequest.toast(err.msg);
						})
					}
				})
			},
			// 删除
			del(item, index) {
				let data = {
					id: item.id,
				}
				let url = "/api/goods/deleteGoods"
				httpRequest.modal('提示', "确认删除当前数据吗?", true, (res) => {
					if (res) {
						httpRequest.request(url, 'GET', data, false, false, true).then(res => {
							httpRequest.toast(res.msg)
							if (res.code == 1) {
								this.list.data.splice(index, 1)
							}
						}).catch(err => {
							httpRequest.toast(err.msg);
						})
					}
				})
			},
			// 获取商品列表
			init(isPage, page) {
				let _this = this;
				httpRequest.request('/api/goods/myGoodsList', 'POST', {
					page: page || 1,
					limit: _this.limit,
				}, false, false, true).then(res => {
					if (res.code == 1) {
						let resList = res.data;
						let dataList = _this.list;
						if (isPage == true) {
							_this.list.data = dataList.data.concat(resList.data);
						} else {
							this.list = res.data
							_this.list.data = resList.data;
						}
					}

				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			onReachBottom() {
				let _this = this;
				let list = _this.list;
				let page = _this.page;
				if (list.last_page <= page) {
					return false;
				}
				page++;
				_this.page = page;
				_this.init(true, page);
			},
			tianjia() {
				uni.navigateTo({
					url: '/pages/mypage/tianjiashangpin'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.posilable{
		position: absolute;
		top: 0;
		right: 0;
		border-radius: 0 11rpx 0 11rpx ;
		padding: 10rpx 20rpx;
		font-size: 24rpx;
	}
	.center {
		padding: 0 30rpx;
	}

	.nav_xian {
		padding-bottom: 30rpx;
		border-bottom: 2rpx solid RGBA(247, 247, 247, 1);
	}

	/deep/.u-tabs__wrapper__nav__item {
		//平均分配
		flex: 1;
	}

	.text {
		margin-left: 11rpx;
	}

	.cm {
		font-size: 22rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
		padding-left: 21rpx;
		margin-top: 8rpx;
	}

	.content {
		background-color: #fafafa;
		min-height: 100vh;
		overflow: hidden;
	}

	.xiangqing {
		font-size: 24rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
		padding-right: 11rpx;
		padding-left: 261rpx;
	}

	.car_img {
		width: 132rpx;
		height: 132rpx;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
	}

	.nav_b {
		padding: 36rpx 32rpx;
		background-color: #fff;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		position: relative;
	}

	.right_henan {
		width: 410rpx;
		font-size: 30rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #000000;
		padding-left: 19rpx;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.liu {
		padding: 30rpx 60rpx 0rpx 60rpx;
	}

	.liulan {
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #666666;
	}
</style>